<template>
    <FormItem :label="Config.Label + ' :'" class="FormItem">
        <div class="FormBox ivu-input ivu-input-small">
            <div class="ivu-input-wrapper ivu-input-wrapper-small ivu-input-type-text">
                <input type="number" :disabled="Config.disable" class="ivu-input ivu-input-small" v-model="value[Config.ParentKey][Config.ParamKey]" />
            </div>
            <span class="Unit">{{ Config.Unit }}</span>
        </div>
    </FormItem>
</template>

<script>
export default {
    props: ['value', 'Config']
}
</script>

<style lang="less" scoped>
.FormItem {
    margin: 0.5rem 0;
    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
        appearance: none !important;
    }
    /deep/.ivu-form-item-label {
        padding-top: 5px;
        padding-bottom: 5px;
    }
    input[type='number'] {
        appearance: none !important;
        -moz-appearance: textfield;
    }
    input {
        border: none;
        background-color: transparent;
    }
}
.FormBox {
    padding: 0;
    display: flex;
    background-color: rgba(225, 225, 225, 0.1);
}
.Unit {
    padding: 0 5px;
    font-size: 13px
    // line-height: 2rem;
}
</style>